<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>樣本送出</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="../../css/oksub.css">
	<script type="text/javascript" src="../../lib/loading/okLoading.js"></script>
</head>
<body>
  <input type="hidden" id="LOCATIONID" value="">
<div class="ok-body">
	<!--模糊搜索区域-->
	<div class="layui-row">
		<form class="layui-form ok-search-form">	
			
			<div class="layui-form-item">	
			<div class="layui-inline">
					<label class="layui-form-label">类型</label>
					<div class="layui-input-inline">
						<select  id="Type" name = "Type"	> 
						<option value='1'>角色</option>
						<option value='2'>职位</option>
						<option value='3'>岗位</option>
						</select></div>
				</div>
				<div class="layui-inline">
					<label class="layui-form-label">名称</label>
					<div class="layui-input-inline">
						<input type="text" class="layui-input" autocomplete="off" id="FullName" name="FullName">
					</div>
				</div>
				<div class="layui-inline">
					<div class="layui-input-inline">
						<button class="layui-btn" lay-submit="" lay-filter="search">
							<i class="layui-icon">&#xe615;</i>
						</button>
					</div>
				</div>
			</div>
		</form>
	</div>
	<!--数据表格-->
	<table class="layui-hide" id="tableId" lay-filter="tableFilter" ></table>
</div>
<!--js逻辑-->
<script src="../../lib/layui/layui.js"></script>
<script>
     var timestamp = "";  
	layui.use(["element", "jquery", "table", "form", "laydate", "okLayer", "okUtils"], function () {
		let table = layui.table;
		let form = layui.form;
		let laydate = layui.laydate;
		let okLayer = layui.okLayer;
		let okUtils = layui.okUtils;		
		let $ = layui.jquery;		
		okLoading.close($);
		var  searchcondition =JSON.stringify({Type:1});
		let stable = table.render({
			elem: '#tableId',
			url: "../../RoleServlet?method=getList",	
			limit: 10,
			size: "sm",
			page: true,
			defaultToolbar: false,	
			where:{searchcondition: searchcondition},
			toolbar: "#toolbarTpl",		
			cols: [[
				{title: "ID", type :"numbers", width: 160},
				{field: "RoleId", title: "id", width: 100, hide: true},
				{field: "FullName", title: "FullName", width: 200},	
				{field: "Type", title: "Type", width: 200,templet: function(d){ 
					if(d.Type == 1){
						return "角色";
					}else if(d.Type == 2){
						return "职位";
					}else if(d.Type == 3){
						return "岗位";
					}
					
					
				}},	
				{field: "SortCode", title: "SortCode", width: 200},
				{title: "操作", width: 100, align: "center", fixed: "right", templet: "#operationTpl"}
			]],
			done: function (res, curr, count) {
				console.info(res, curr, count);
			}
		});

		form.on("submit(search)", function (data) {
		    var searchdata = data.field;		   
		    var  searchcondition =JSON.stringify(searchdata);
		    stable.reload({
				where: {searchcondition: searchcondition},
				page: {curr: 1}
			});
			return false;
		});

		table.on("toolbar(tableFilter)", function (obj) {
			switch (obj.event) {
				case "add":
					add();
					break;			
			}
		});
		table.on("tool(tableFilter)", function (obj) {
			let data = obj.data;
			switch (obj.event) {
				case "edit":
					edit(data);
					break;
				case "del":
					del(data);
					break;
			}
		});	
		

		function add() {
			okLayer.dialogOpen({url:"form.html",callBack:function(iframeId){ 
				frames[iframeId].AcceptClick();
				  stable.reload();
				  layer.closeAll();
				}
			});
		}

		function edit(data) {
			
			okLayer.dialogOpen({url:"form.html?ID="+data.RoleId,callBack:function(iframeId){ 
				frames[iframeId].AcceptClick();
				  stable.reload();
				  layer.closeAll();
				}
			});
		  
		}

		function del(data) {
			okLayer.confirm("SURE DELETE ?", function () {			
				okUtils.ajax("RoleServlet?method=delete", "get", {ID: data.RoleId}, true).done(function (response) {
				    stable.reload();
					okUtils.tableSuccessMsg(response.msg);
				}).fail(function (error) {
					console.log(error)
				});
			})
		}
	})
</script>
<!-- 头工具栏模板 -->
<script type="text/html" id="toolbarTpl">
	<div class="layui-btn-container">
		<button class="layui-btn layui-btn-sm layui-btn-normal" lay-event="add">新增</button>	
</div>
</script>
<!-- 行工具栏模板 -->
<script type="text/html" id="operationTpl">
	<a href="javascript:" title="编辑" lay-event="edit"><i class="layui-icon">&#xe642;</i></a>
	<a href="javascript:" title="删除" lay-event="del"><i class="layui-icon">&#xe640;</i></a>
</script>
</body>
</html>
